<!--  -->
<template>
  <div class="">
    <a-form-item label="阶段审核">
      <a-switch :checked="checked == 1" @change="onChange" />
      <span class="_ml-20" style="color: #86909C">开启后本阶段需要管理员审核</span>
    </a-form-item>
    <a-form-item v-if="checked" label="审核人员">
      <div>
        <template v-for="(item, index) in auditList">
          <a-tag  closable :key="item.id" @close="handleDel(index)">
            {{ item.userName }}
          </a-tag>
        </template>
      </div>
      <a-button type="primary" @click="handleCheckUser">选择审批人</a-button>
    </a-form-item>

    <!-- <s-table ref="table" size="default" rowKey="id, enabled, title" :columns="columns" :data="loadData" -->
    <!-- <a-table :columns="columns" :data-source="auditList" :rowSelection="null">

      <span slot="user" slot-scope="text, record, index">
        <div class="user">
          <img class="img" :src="record.avatar" alt="" />
          <div class="info">
            <div>{{ record.userName }}</div>
            <div>{{ record.phonenumber }}</div>
          </div>
        </div>
      </span>

      <span slot="action" slot-scope="text, record, index">
        <template>
          <a @click="handleDel(index)">删除</a>
        </template>
      </span>
    </a-table> -->
    <MemberModule ref="memberModule" @getApprovalUser="getApprovalUser" />
  </div>
</template>

<script>
import { STable } from '@/components'
import MemberModule from '../memberModule'
import { getList } from '@/api/member/record'

export default {
  props: ['auditList', 'checked'],
  components: {
    STable,
    MemberModule
  },
  data() {
    return {
      columns: [
        {
          title: '员工信息',
          scopedSlots: { customRender: 'user' }
        },
        {
          title: '角色',
          dataIndex: 'roleName'
        },
        {
          title: '操作',
          scopedSlots: { customRender: 'action' }
        }
      ],
      isApproval: false,
      loadData: []
    }
  },
  computed: {},
  watch: {},
  methods: {
    hasAuditList(id) {
      console.log(this.auditList);
      return this.auditList.find(v => v.userId == id)
    },
    handleCheckUser() {
      let checkedKeys = (this.auditList || []).map(item => item.userId)
      this.$refs.memberModule.open(checkedKeys, this.auditList || [])
    },
    getApprovalUser(rows) {
      console.log('rows----->', rows)
      this.$emit('getApprovalUser', rows)
    },
    handleDel(index) {
      this.loadData.splice(index, 1)
      this.$emit('delApprovalUser', index)
    },
    onChange(checked) {
      this.$emit('getChecked', checked ? 1 : 0)
    }
  },
  created() {

  },
  mounted() {}
}
</script>
<style scoped lang="less">
.user {
  display: flex;
  align-items: center;

  .img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
  }

  .info {
    margin-left: 10px;
  }
}
</style>
